<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单校验测试</title>
    <link href="bootstrapValidator/bootstrap.css" rel="stylesheet">

    <!--<link href="webjars/bootstrap/3.0.1/css/bootstrap.min.css" rel="stylesheet">-->
    <link href="css/bootstrapValidator.min.css" rel="stylesheet">

    <!--<script src="bootstrapValidator/jquery.min.js"></script>-->
    <!--<script src="bootstrapValidator/bootstrap.min.js"></script>-->
    <script src="webjars/jquery/2.0.0/jquery.min.js"></script>
    <script src="webjars/bootstrap/3.0.1/js/bootstrap.min.js"></script>
    <script src="js/bootstrapValidator.min.js"></script>

</head>
<body>
<form>
    <div class="form-group">
        <label>Username</label>
        <input type="text" class="form-control" name="username"/>
    </div>
    <div class="form-group">
        <label>Email address</label>
        <input type="text" class="form-control" name="email"/>
    </div>
    <div class="form-group">
        <button type="submit" name="submit" class="btn btn-primary" onclick="test">Submit</button>
    </div>
</form>

<form>
    <div class="form-group">
        <label>Username</label>
        <input type="text" class="form-control" name="username" />
    </div>
    <div class="form-group">
        <label>Email address</label>
        <input type="text" class="form-control" name="email" />
    </div>
    <div class="form-group">
        <button type="submit" name="submit" class="btn btn-primary">Submit</button>
    </div>
    ssssss<span class="glyphicon glyphicon-ok-circle"></span>
</form>
<script>
    function test() {
        alert("denglu")
        
    }
    $(function () {
        $('form').bootstrapValidator({
            message: 'This value is not valid',
            feedbackIcons: {
                /*无法显示注释掉*/
//                valid: 'glyphicon glyphicon-ok',
//                invalid: 'glyphicon glyphicon-remove',
//                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                username: {
                    message: '用户名验证失败',
                    validators: {
                        notEmpty: {
                            message: '用户名不能为空'
                        },
                        stringLength: {
                            min: 6,
                            max: 18,
                            message: '用户名长度必须在6到18位之间'
                        },
                        regexp: {
                            regexp: /^[a-zA-Z0-9_]+$/,
                            message: '用户名只能包含大写、小写、数字和下划线'
                        }
                    }
                },
                email: {
                    validators: {
                        notEmpty: {
                            message: '邮箱不能为空'
                        },
                        emailAddress: {
                            message: '邮箱地址格式有误'
                        }
                    }
                }
            }
        });
    });
</script>
</body>
</html>